import Qt 4.7
import "../js/Delegate.js" as Delegate
import "../js/Engine.js" as Engine
import "../"

Item {
    id: myCitiesDelegate
    height: 70
    width: myCitiesDelegate.ListView.view.width


    // Pull-to-reload
    Image {
        id: logoImage2
        source: "../Images/refresharrow.png"
        anchors.bottom: parent.top
        anchors.bottomMargin: 10
        anchors.horizontalCenter: parent.horizontalCenter
        smooth: true
        visible: index == 0
        opacity: -myCitiesList.contentY > 10 ? 1 : 0
        Behavior on opacity { NumberAnimation { duration: 100  } }
        z: 2
        rotation: {
            var myY = - myCitiesList.contentY * 3;
            if (myY > 280) {
                myCitiesList.state = "loadingMyCollectionCities";
            }

            if (myY > 130) {
                myY = 180;
            } else {
                myY = 0;
            }

            return -myY;
        }
        Behavior on rotation { NumberAnimation { duration: 150 } }
    }
    //


    Image {
        id: background
        width: parent.width
        height: parent.height;
        source: "../Images/macapp_cellbg.png"
        smooth: true
        fillMode: Image.Stretch
        anchors.top: parent.top
    }


    MouseArea {
        id: mouseAreaCell
        anchors.fill: parent
        onClicked: {
            if (cityType == "placeholder") {
                return Text.AlignHCenter;
            } else {
                console.log("city clicked");
            }
        }
    }

    Text {
        id: textCityName
        anchors.leftMargin: 20
        anchors.left: parent.left
        anchors.verticalCenter: parent.verticalCenter
        anchors.right: parent.right
        anchors.rightMargin: 20
        text: cityName
        horizontalAlignment: {
            if (cityType == "placeholder") {
                return Text.AlignHCenter;
            } else {
                return Text.AlignLeft;
            }
        }
        wrapMode: Text.WordWrap
        smooth: true

        font { bold: true; family: "Helvetica"; pixelSize:24 }
        color: "#FFFFFF"
    }







    }


